import { Component, ViewChild } from '@angular/core';
import { NavController, IonicPage, Slides } from 'ionic-angular';
import { NativePageTransitions, NativeTransitionOptions } from '@ionic-native/native-page-transitions';
//import { CardImagePage } from './card-image';

@IonicPage()
@Component({
  selector: 'page-sliding-item',
  templateUrl: 'sliding-item.html'
})
export class SlidingItemPage {
  @ViewChild('slider') slider: Slides;
  slideIndex = 0;
  slides = [
    {
      title: 'Dream\'s Adventure',
      imageUrl: 'assets/imgs/lists/stadium.jpg',
      description: 'Take a look at our amazing options',
    },
    {
      title: 'For the Weekend',
      imageUrl: 'assets/imgs/lists/stadium-3.png',
      description: 'Take a look at our amazing options',
    },
    {
      title: 'Family Time',
      imageUrl: 'assets/imgs/lists/stadium-2.jpg',
      description: 'Take a look at our amazing options',
    },
    {
      title: 'My Trip',
      imageUrl: 'assets/imgs/background/background-3.jpg',
      description: 'Take a look at our amazing options',
    }
  ];


  items = [
    {
      imageUrl: 'assets/imgs/lists/stadium.jpg',
      imageUrlSmall: 'assets/imgs/lists/stadium-s.jpg',
      title: 'First Cup',
      place: 'Madison Square',
      date: '05/06/2016',
      description: 'This repository was made in order to help people learn and speed up their development process. You will find many many different components, pages, pipes, services, of which can be very useful to you.'
    },
    {
      imageUrl: 'assets/imgs/lists/stadium-3.png',
      imageUrlSmall: 'assets/imgs/lists/stadium-3-s.png',
      title: 'Season',
      place: 'Hooli',
      date: '15/03/2016',
      description: 'you will like this repo and feel like contributing, so please if you can, contribute so we can have even more amazing content!'
    },
    {
      imageUrl: 'assets/imgs/lists/stadium-2.jpg',
      imageUrlSmall: 'assets/imgs/lists/stadium-2-s.jpg',
      title: '2nd Season',
      place: 'Castelão',
      date: '05/12/2015',
      description: 'Once you clone this repository, run this command on your terminal to install all needed dependencies'
    },
  ];

  constructor(public navCtrl: NavController, private nativePageTransitions: NativePageTransitions) {}

  delete(event, item) {
    event.stopPropagation();
    alert('Deleted ' + item.title);
  }

  viewComments(event, item) {
    event.stopPropagation();
    alert('Viewing comments of ' + item.title);
  }

  viewPlayers(event, item) {
    event.stopPropagation();
    alert('Viewing players of ' + item.title);
  }

  itemTapped(event, item) {
    let options: NativeTransitionOptions = {
      direction: 'left',
      duration: 400,
      slowdownfactor: -1,
      iosdelay: 50
     };
 
    this.nativePageTransitions.slide(options);    
    this.navCtrl.push("CardImagePage", item);
  }

  onSlideChanged() {
    this.slideIndex = this.slider.getActiveIndex();
    console.log('Slide changed! Current index is', this.slideIndex);
  }

  goToDetailPage(event, slide) {
    alert('Viewing ' + slide.title);
  }


}
